<template>
  <div>
    <AdTable @register="registerTable">
      <template #expandedRowRender="{ record }">
        <AdTable @register="registerPropertyTable" :dataSource="JSON.parse(record.PropertyJson)" />
      </template>
      <template #bodyCell="{ column, record }">
        <template v-if="column?.key === 'action'">
          <TableAction  stopButtonPropagation
            :actions="[
              {
                icon: 'clarity:note-edit-line',
                tooltip: t('common.editText'),
                auth: 'Root.Admin.Auth.EntityInfo.Update', // 权限控制
                ifShow: (_action) => {
                  return record?.Updatable === true; // 根据业务控制是否显示: 是否可更新的数据权限状态
                },
                onClick: handleEdit.bind(null, record),
              },
            ]"
          />
        </template>
      </template>
    </AdTable>
  </div>
</template>

<script lang="ts" setup>
  import { useI18n } from '@/hooks/web/useI18n';
  import { AdTable, useAdTable, TableAction } from '@/components/AdTable';
  import { readEntityInfos, updateEntityInfos } from '@/api/authorization/admin/entityinfo';
  import { FormModeEnum } from '@/enums/formEnum';

  import { columns, propertyColumns } from './entityinfo.data';

  defineOptions({ name: 'EntityInfoPage' });

  const { t } = useI18n();
  const [registerTable, { openDetailForm }] = useAdTable({
    // 表标题呈现器
    title: t('routes.system.authorization.entityInfo.entityInfoList'),
    // 表格数据接口请求对象
    api: readEntityInfos,
    // 详情表单
    detailForm: {
      // 表单标识
      formIndex: 'auth_entityinfo_detail',
      // 主键字段
      keyField: 'Id',
      // 详情表单抬头
      title: t('routes.system.authorization.entityInfo.title'),
      // 实体更新接口请求对象
      updateApi: updateEntityInfos,
    },
    // 表单列信息 BasicColumn[]
    columns,
    // 是否可拖拽列
    canColDrag: true,
    // 使用搜索表单
    useSearchForm: true,
    // 显示表格设置工具
    showTableSetting: true,
    //表格设置项
    tableSetting: { redo: true, size: true, setting: true, fullScreen: true },
    // 是否显示表格边框
    bordered: false,
    // 是否显示序号列
    showIndexColumn: true,
    // 表格右侧操作列配置 BasicColumn
    actionColumn: {
      width: 80,
      title: t('common.actionText'),
      dataIndex: 'action',
      fixed: 'right',
    },
    expandRowByClick: true,
  });

  /** 处理编辑 */
  async function handleEdit(record: any) {
    openDetailForm(FormModeEnum.Edit, record);
  }

  const [registerPropertyTable] = useAdTable({
    // 表单列信息 BasicColumn[]
    columns: propertyColumns,
    // 是否可拖拽列
    canColDrag: false,
    // 使用搜索表单
    useSearchForm: false,
    // 显示表格设置工具
    showTableSetting: false,
    //表格设置项
    tableSetting: { redo: false, size: true, setting: true, fullScreen: false },
    // 是否显示表格边框
    bordered: false,
    // 是否显示序号列
    showIndexColumn: false,
    pagination: false,
    maxHeight: 200,
  });
</script>
